<style scoped>
</style>

<template >
	<div class="vue-box">
		<div class="c-panel">
			<!-- 参数栏 -->
			<div class="c-title">投诉记录</div>
			<el-form size="mini" :inline="true" @submit.native.prevent >
				<el-form-item label="车位地址：">
					<el-input v-model="p.name" placeholder="请输入车位地址"></el-input>
				</el-form-item>
				<el-form-item style="min-width: 0px;">
					<el-button type="primary" icon="el-icon-search" @click="p.pageNo = 1; f5()">查询</el-button>
					<!-- <el-button type="primary" icon="el-icon-plus" @click="add()">添加</el-button> -->
				</el-form-item>
			</el-form>
			<!-- 数据列表 -->
			<div class="c-title">投诉列表</div>
			<el-table :data="dataList" size="mini">
				<el-table-column label="投诉id" prop="complainId" width="70px"></el-table-column>
				<el-table-column label="投诉人" prop="uname"></el-table-column>
				<el-table-column label="投诉原因" prop="reason"></el-table-column>
				<el-table-column label="订单ID" prop="orderid"></el-table-column>
				<el-table-column label="车位地址" prop="parkingAddress"></el-table-column>
				<el-table-column label="投诉对象" prop="target"></el-table-column>
				<el-table-column label="投诉状态" prop="state"></el-table-column>
				<el-table-column label="处理结果" prop="describe"></el-table-column>

				<el-table-column label="处理操作" width="240px">
					<template slot-scope="s">
						<!-- <el-button class="c-btn" type="success"  icon="el-icon-view" @click="get(s.row)">查看</el-button> -->
						<el-button class="c-btn" type="primary" icon="el-icon-edit" @click="update(s.row.complainId)">处理</el-button>
						<!-- <el-button class="c-btn" type="danger" icon="el-icon-delete" @click="del(s.row)">删除</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<!-- 分页 -->
			<div class="page-box">
				<el-pagination background
					layout="total, prev, pager, next, sizes, jumper" 
					:current-page.sync="p.pageNo" 
					:page-size.sync="p.pageSize" 
					:total="dataCount" 
					:page-sizes="[1,2,3,5, 10, 20, 30, 40, 50, 100]" 
					@current-change="f5()" 
					@size-change="f5()">
				</el-pagination>
			</div>
		</div>
		
		<!-- 增改组件 -->
		<add-or-update ref="add-or-update"></add-or-update>
		
	</div>
</template>
  


<script>
	// import mockDataList from './mock-data-list.js';
	import addOrUpdate from './deal-with-complain.vue';
	
	export default {
		components: {
			addOrUpdate
		},
		data() {
			return {
				p: {		// 查询参数  
					name: '',
					pageNo: 1,
					pageSize: 10,
				},
				dataCount: 0,
				dataList: [],		// 数据集合
			}
		},
		methods: {
			// 刷新
			f5: function(){
				// alert("ss:"+this.p.name);
				var i = localStorage.getItem("token");
				this.sa.ajax(
					'/e-administrator/complain/getComplainList', 
					{
						state:0,
						parkingAddress:this.p.name,
						size:this.p.pageSize,
						current:this.p.pageNo,
						token:i,
					}, 
					function(res){
					// alert("ok:"+res.data.records);	
					this.dataList = res.data.records;	// 数据
					this.dataCount = res.data.total;	// 分页
				}.bind(this),
				// {res: mockDataList},
				{type:'get'},
				);
			},
			// 查看
			// get: function(data) {
			// 	var str = '<div>';
			// 	str += '<p>编号：' + data.id + '</p>';
			// 	str += '<p>名称：' + data.name + '</p>';
			// 	str += '<p>状态：' + (data.status == 1 ? '正常' : '禁用') + '</p>';
			// 	str += '<p>价格：' + (data.money / 100) + ' 元</p>';
			// 	str += '<p>日期：' + (this.sa.forDate(data.create_time, 2)) + '</p>';
			// 	str += '</div>';
			// 	this.sa.alert(str);
			// },
			// 添加
			// add: function () {
			// 	this.$refs['add-or-update'].open(0);
			// },
			// 修改
			update: function (data) {
				// alert("1111jjjj:"+data);
				this.$refs['add-or-update'].open(data);
                 
				// this.sa.ajax(
				// 		'/e-administrator/complain/getComplainById',
				// 			{
				// 			complainId:data,	
				// 			}, 
				// 		function(res){
				// 		alert("根据id获取成功:"+res.data);
						

				// 			// this.propertyList = res.data;	// 数据
				// 			// this.dataCount = res.dataCount;	// 分页
				// 		}.bind(this),
				// 	{type:'get'},
				// 	);

			},
			// 删除
			// del: function (data) {
			// 	this.sa.confirm('是否删除，此操作不可撤销', function() {
			// 		this.sa.ajax2('/goods/delete?id=' + data.id, function() {
			// 			this.sa.arrayDelete(this.dataList, data);
			// 			this.sa.ok('删除成功');
			// 		}.bind(this))
			// 	}.bind(this));
			// },
		},
		created: function(){
			this.f5();
			this.$notify.info({
				title: '消息',
				message: '本页面展示表格的常见显示方式'
			});
		}
	}
</script>
